import React, {useEffect} from "react";
import {Overlay} from "react-native-elements";
import {Dimensions, ImageBackground, View, Text, TouchableOpacity} from "react-native";
import AlertBG from '../assets/AlertBG.png';

const {width, height} = Dimensions.get("window");

const MyAlert = ({info,BTNcount,visible,back,title,line}:any) => {

    useEffect(()=>{
        // console.log("MyAlert!")
        // console.log(BTNcount==2)
    })
    return(
        visible?(
                <View style={{marginTop:-height,height:height,width:width,backgroundColor:"#0000009E",alignItems:"center"}}>
                    <View style={{width:"80%",backgroundColor:"white",marginTop:"70%",borderRadius:8}}>
                        <Text style={{marginTop:10,paddingBottom:10,marginBottom:0,marginLeft:"10%",marginRight:"10%",fontWeight:"bold",fontSize:18,color:"#262626"}}>
                            {title}
                        </Text>
                        <Text style={{lineHeight:30,paddingBottom:20,marginBottom:10,marginLeft:"10%",marginRight:"10%",fontWeight:"bold",fontSize:16,color:"#262626",borderBottomColor:"grey",borderBottomWidth:0.2}}>
                            {info}
                        </Text>
                        {
                            BTNcount==2?
                                <View style={{flexDirection:"row",marginLeft:"10%",marginRight:"10%",marginTop:5,marginBottom:10,alignContent:"space-between",justifyContent:"space-between"}}>
                                    <TouchableOpacity style={{marginBottom:5}} onPress={()=>back(true)}>
                                        <View style={{width:0.25*width,height:30,backgroundColor:"#7460e3",justifyContent:"center",borderRadius:2}}>
                                            <Text style={{alignSelf:"center",fontSize:16,color:"white"}}>
                                                确定
                                            </Text>
                                        </View>
                                    </TouchableOpacity>

                                    <TouchableOpacity onPress={()=>back(false)}>
                                        <View style={{width:0.25*width,height:30,backgroundColor:"#7460e3",justifyContent:"center",borderRadius:2}}>
                                            <Text style={{alignSelf:"center",fontSize:16,color:"white"}}>
                                                取消
                                            </Text>
                                        </View>
                                    </TouchableOpacity>
                                </View>:null
                        }
                        {
                            BTNcount!==2?
                                <View style={{flexDirection:"row",marginLeft:"10%",marginRight:"10%",marginTop:5,marginBottom:10,justifyContent:"center"}}>
                                    <TouchableOpacity style={{marginBottom:5}} onPress={()=>back(true)}>
                                        <View style={{width:0.6*width,height:30,backgroundColor:"#7460e3",justifyContent:"center",borderRadius:2}}>
                                            <Text style={{alignSelf:"center",fontSize:16,color:"white"}}>
                                                确定
                                            </Text>
                                        </View>
                                    </TouchableOpacity>
                                </View>:null
                        }

                    </View>
                </View>)
                :null
    )
};
export default MyAlert;
